<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%><!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
	.tree-node {padding:0;}
</style>
<script type="text/javascript">
$.extend($.fn.datagrid.defaults.editors, {
    validbox: {
        init: function(container, options){
            var input = $('<input type="checkbox"/>').appendTo(container);
            return input;
        },
        destroy: function(target){
            $(target).remove();
        },
        getValue: function(target){
            return target[0].checked;
        },
        setValue: function(target, value){
        	target[0].checked = value == true;
        },
        resize: function(target, width){
            $(target)._outerWidth(width);
        }
    }
});

$(function() {
	$('#toolbar').toolbar({buttons:[
      	{name:'add',iconCls:'icon-add',text:'新增记录',disabled:true},
   
   		{name:'del',iconCls:'icon-del',text:'删除选中记录',disabled:true},
   		{name:'save',iconCls:'icon-save',text:'保存字典列表',disabled:true}
 	],handler:handler});
	$('#tree').tree({url:'treeType.do',lines:true,
		onContextMenu: function(e, node){
			e.preventDefault();
			// 查找节点
			$('#tree').tree('select', node.target);
			//alert(node.pid);
			
			//判断是不是一级菜单
			if(node.pid==0){
				// 显示快捷菜单
				$('#mm').menu('show', {
					left: e.pageX,
					top: e.pageY
				});
			}
			
		},

		onClick:function(node){
			if(node.children && node.children.length > 0) {
				$('#toolbar').toolbar('disableAll');
				$('#data').empty();
				return;
			}
			$('#toolbar').toolbar('enableAll');
			loadData(node.id);
        }
	});
	$('#data').height(document.documentElement.clientHeight-66);
});

function handler() {
	if(!$('#data').attr('data-id')) return;
	if(this.name == 'addCodeType') return toAdd();
	switch(this.name) {
	case 'add': append();break;
	case 'del': removeit();break;
	case 'save': accept();break;
	case 'undo': reject();break;
	}
}

function loadData(type) {
	$('#data').attr('data-id',type).html('<table id="dg"></table>');
	$('#dg').datagrid({url:'findCodes.do?type='+type,singleSelect:true,nowrap: true, pagination: false,rownumbers:true,fit:true,fitColumns:true,
        onClickRow: onClickRow,
		columns:[[
			{field:'code',title:'代码', width:60,editor:{type:'validatebox',options:{required:true,validType:'length[1,30]'}}},
			{field:'name',title:'名称', width:160,editor:{type:'validatebox',options:{required:true,validType:'length[1,120]'}}},
			{field:'index',title:'顺序', width:50,editor:{type:'numberbox',options:{required:true,precicion:0,min:0}}},
			{field:'memo',title:'备注', width:300,editor:{type:'validatebox',options:{validType:'length[0,300]'}}},
			{field:'valid',title:'状态', width:30,align:'center',formatter:$g.bv,editor:'validbox'}
			]]
	});
}

var editIndex = undefined;
function endEditing(){
    if (editIndex == undefined){return true}
    if ($('#dg').datagrid('validateRow', editIndex)){
        $('#dg').datagrid('endEdit', editIndex);
        editIndex = undefined;
        return true;
    } else {
        return false;
    }
}
function onClickRow(index){
    if (editIndex != index){
        if (endEditing()){
            $('#dg').datagrid('selectRow', index).datagrid('beginEdit', index);
            editIndex = index;
        } else {
            $('#dg').datagrid('selectRow', editIndex);
        }
    }
}





function append(){
	
    if (endEditing()){
    	var rows = $('#dg').datagrid('getRows');
    	var iv = rows&&rows.length > 0?rows[rows.length -1].index+1 : 1;
    	if(isNaN(iv)) iv = rows.length + 1;
        $('#dg').datagrid('appendRow',{valid:true,index:iv});
        editIndex = $('#dg').datagrid('getRows').length-1;
        $('#dg').datagrid('selectRow', editIndex).datagrid('beginEdit', editIndex);
    }
}
function removeit(){
    if (editIndex == undefined){return}
    $('#dg').datagrid('cancelEdit', editIndex).datagrid('deleteRow', editIndex);
    editIndex = undefined;
}
function accept(){
    if (endEditing()) $('#dg').datagrid('acceptChanges');
    var rows = $('#dg').datagrid('getRows');
    var params = [];
    params[0] = {name:'type',value:$('#data').attr('data-id')};
    var pname, row;
    var codes = {};
    for(var i = 0; i < rows.length; i++) {
    	row = rows[i]
    	if(!row.code || !row.name) return $alert('第'+(i+1)+'行填写不完整');
    	if(codes[row.code]) return $alert('存在重复的代码：'+row.code);
    	if(isNaN(row.index)) return $alert('第'+(i+1)+'行的顺序号不是整数');
    	codes[row.code] = true;
    	pname = 'codes['+i+'].';
    	params[params.length] = {name:pname+'code',value:row.code};
    	params[params.length] = {name:pname+'name',value:row.name};
    	params[params.length] = {name:pname+'index',value:row.index};
    	params[params.length] = {name:pname+'memo',value:row.memo};
    	params[params.length] = {name:pname+'valid',value:row.valid==true};
    }
    
    $.post('save',params, function(r) {
    	if(r.code<0)return $alert(r.msg);
    	$prompt('保存成功');
    });
}

function reject(){
    $('#dg').datagrid('rejectChanges');
    editIndex = undefined;
}

function  appendMm(is){

	var node = $('#tree').tree('getSelected');
	var id;
	if(node==null){
		id=0;
	}else{
		id=node.id;
	}
	isAdd = true;
	show({code:'app_code_index',title:'新增字典信息',iconCls:'icon-add',uri:'add?id='+id+'&is='+is,width:800,height:600,
		options : {
			success : function(data) { 
				$('#tree').tree({url:'treeType.do',lines:true});
			},
			error:function(data){
				
			},
			close:function(data){
				
			}
		}
	});  
}
function test(){
	
}
$(function(){
    /*为选项卡绑定右键*/
   $("#treeID").live('contextmenu',function(e){
       //显示快捷菜单
       $('#mm2').menu('show', {
           left: e.pageX,
           top: e.pageY
       });
       
       return false;
   });
});

</script>
</head>
<body class="easyui-layout" data-options="border:false">
	<div  id="treeID" data-options="region:'west',border:true,title:'字典类型',split:true" style="width:200px;" oncontextmenu="">
		<ul id="tree">
		</ul>
	</div>
	<div data-options="region:'center',border:true,title:'字典数据'">
		<div id="toolbar" class="toolbar"></div>
		<div id="data"></div>
	</div>
	
<div id="mm" class="easyui-menu" style="width:120px;">
	<div onclick="appendMm(1)" data-options="iconCls:'icon-add'">添加子节点</div>
	<!-- <div onclick="remove()" data-options="iconCls:'icon-remove'">修改</div> -->
</div>
	<div id="mm2" class="easyui-menu" style="width:120px;">
	<div onclick="appendMm(0)" data-options="iconCls:'icon-add'">添加节点</div>
	<!-- <div onclick="remove()" data-options="iconCls:'icon-remove'">修改</div> -->
</div>
</body>
</html>